<!DOCTYPE html>
<html>
<head>
    {(common/meta.html)}
</head>

<body class="fixed-sidebar full-height-layout gray-bg">
    <div id="wrapper">
        {(common/left_nav.html)}<!-- 左侧导航 -->

        <!--右侧部分开始-->
        <div id="page-wrapper" class="gray-bg dashbard-1">
            <div class="row J_mainContent">
                <!-- content start -->
                <div class="row content-header">
                    <div class="col-md-12">
                        <div class="pull-left">
                            <h4 class="head_title">Rate Limiting 防刷</h4>
                        </div>
                        <div class="pull-right">
                             {(common/plugin-op.html)}
                        </div>
                    </div>
                </div>

                {(common/data-view-part.html)}
                {(common/right-selector-rule-part.html)}
                <!-- content end -->
            </div>
        </div><!--右侧部分结束-->

    </div>


    <script id="rule-item-tpl" type="text/template">
        {@each rules as r, index}
        <li data-id="${r.id}" {@if r.enable==true } class="info-element"{@/if}
            {@if r.enable!=true } class="warning-element"{@/if}>
            <table class="table table-hover single-rule-table">
                <tbody>
                    <tr>
                        <td class="center rule-enable-td">
                            {@if r.enable==true }
                                <span class="label label-primary">已启用</span>
                            {@/if}
                            {@if r.enable!=true }
                                <span class="label label-warning">已禁用</span>
                            {@/if}
                        </td>
                        <td class="rule-name-td">
                            <b class="namep">${r.name}</b>
                        </td>
                        <td class="left rule-extractor-td">
                            <p class="extractorp">
                                {@if r.extractor}
                                <b>变量提取类型</b>:
                                    {@if !r.extractor.type || r.extractor.type==1 }
                                        索引式提取
                                    {@/if}
                                    {@if r.extractor.type==2 }
                                        模板式提取
                                    {@/if}
                                <br/>
                                {@/if}
                            </p>

                            {@if r.extractor && r.extractor.extractions }
                                {@each r.extractor.extractions as e, index}

                                    {@if !r.extractor.type || r.extractor.type==1 }<!-- 索引式提取 -->
                                        {@if e.type!="URI" }
                                            <span>$</span><span>{</span>${ parseInt(index)+1 }<span>}</span>:
                                            ${e.type}{@if e.name }[${e.name}]{@/if}

                                            {@if e.default=="" || e.default }
                                                <span style="color:#aaa;margin-left:15px;">
                                                    default: <i style="text-decoration:underline">${e.default}</i>
                                                </span>
                                            {@/if}
                                        {@/if}

                                        {@if e.type=="URI" }
                                            <span>$</span><span>{</span>${ parseInt(index)+1 }<span>}</span>:
                                            <i style="text-decoration:underline">${e.name}</i>
                                        {@/if}
                                        <br/>
                                    {@/if}
                                    {@if r.extractor.type==2 }<!-- 模板式提取 -->
                                        {@if e.type!="URI" }
                                            <span>{</span><span>{</span>
                                            {@if e.type=="Query" }query.<span>${e.name}</span>{@/if}
                                            {@if e.type=="Header" }header.<span>${e.name}</span>{@/if}
                                            {@if e.type=="PostParams" }body.<span>${e.name}</span>{@/if}
                                            {@if e.type=="Host" }host{@/if}

                                            {@if e.type=="IP" }ip{@/if}
                                            {@if e.type=="Method" }method{@/if}
                                            <span>}</span><span>}</span>

                                            {@if e.default=="" || e.default }
                                                <span style="color:#aaa;margin-left:15px;">
                                                    default: <i style="text-decoration:underline">${e.default}</i>
                                                </span>
                                            {@/if}
                                        {@/if}

                                        {@if e.type=="URI" }
                                           <span>{</span><span>{</span>
                                            uri.v1 or uri.v2 ...
                                           <span>}</span><span>}</span>

                                           <i style="text-decoration:underline">regrex: ${e.name}</i>

                                        {@/if}
                                        <br/>
                                    {@/if}

                                {@/each}
                            {@/if}
                        </td>

                        <td class="left rule-urltmpl-td">
                            间隔: ${r.handle.period}<br/>
                            最多次数: ${r.handle.count}<br/>
                            记录日志: ${r.handle.log}
                        </td>

                        <td class="left" title="变更时间">
                            <small>${r.time}</small>
                        </td>
                        <td class="center rule-op-td">
                            <a class="btn btn-white btn-sm edit-btn" data-id="${r.id}" data-name="${r.name}"><i title="编辑" class="fa fa-pencil"></i> </a>
                            <a class="btn btn-white btn-sm delete-btn" data-id="${r.id}" data-name="${r.name}"><i title="删除" class="fa fa-trash"></i></a>
                        </td>
                    </tr>
                </tbody>
            </table>
        </li>
        {@/each}
    </script>

    <script id="add-tpl" type="application/template">
        <div id="rule-edit-area">
            <form id="add-rule-form" class="form-horizontal">
                <div class="form-group">
                    <label for="input-name" class="col-sm-1 control-label">名称</label>
                    <div class="col-sm-11">
                        <input type="text" class="form-control" id="rule-name" placeholder="名称">
                    </div>
                </div><!-- name -->

                <!-- add - 变量提取器模板 start -->
                {(common/extraction-add.html)}
                <!-- add - 变量提取器模板 end -->

                <div class="form-group handle-holder">
                    <label class="col-sm-1 control-label">处理</label>
                    <div class="col-sm-3">
                        <select class="form-control" id="rule-handle-period">
                            <option value="1">1秒</option>
                            <option value="60">1分钟</option>
                            <option value="3600">1小时</option>
                            <option value="86400">1天</option>
                        </select>
                    </div>
                    <div class="col-sm-3">
                         <input type="text" class="form-control" id="rule-handle-count" value="" placeholder="最多次数"/>
                    </div>
                    <div class="col-sm-3">
                        <select class="form-control" id="rule-handle-log">
                            <option value="true">记录日志</option>
                            <option value="false">不记录日志</option>
                        </select>
                    </div>
                </div><!-- handle log-->

                <div class="form-group">
                    <div class="col-sm-offset-1 col-sm-11">
                        <div class="checkbox">
                            <label>
                                <input type="checkbox" id="rule-enable"> 启用
                            </label>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </script>

    <script id="edit-tpl" type="application/template">
        <div id="rule-edit-area">
            <form id="edit-rule-form" class="form-horizontal">
                <div class="form-group">
                    <label for="input-name" class="col-sm-1 control-label">名称</label>
                    <div class="col-sm-11">
                        <input type="text" class="form-control" id="rule-name" value="${r.name}" placeholder="名称">
                    </div>
                </div><!-- name -->

                <!-- add - 变量提取器模板 start -->
                {(common/extraction-edit.html)}
                <!-- add - 变量提取器模板 end -->

                <div class="form-group handle-holder">
                    <label class="col-sm-1 control-label">处理</label>
                    <div class="col-sm-3">
                        <select class="form-control" id="rule-handle-period">
                            <option value="1" {@if r.handle.period==1} selected {@/if}>1秒</option>
                            <option value="60" {@if r.handle.period==60} selected {@/if}>1分钟</option>
                            <option value="3600" {@if r.handle.period==3600} selected {@/if}>1小时</option>
                            <option value="86400" {@if r.handle.period==86400} selected {@/if}>1天</option>
                        </select>
                    </div>
                    <div class="col-sm-3">
                         <input type="text" class="form-control" id="rule-handle-count" value="${r.handle.count}" placeholder="最多次数"/>
                    </div>

                    <div class="col-sm-3">
                        <select class="form-control" id="rule-handle-log">
                            <option value="true" {@if r.handle.log==true} selected {@/if}>记录日志</option>
                            <option value="false" {@if r.handle.log==false} selected {@/if}>不记录日志</option>
                        </select>
                    </div>
                </div><!-- handle -->

                <div class="form-group">
                    <div class="col-sm-offset-1 col-sm-11">
                        <div class="checkbox">
                            <label>
                                <input {@if r.enable==true} checked {@/if} type="checkbox" id="rule-enable"> 启用
                            </label>
                        </div>
                    </div>
                </div>

            </form>
        </div>
    </script>


    {(common/extraction-tmpl.html)}

    {(common/selector-item-tpl.html)}
    {(common/selector-add.html)}
    {(common/selector-edit.html)}

    {(common/common_js.html)}<!-- 通用js -->

    <script src="/static/js/property_rate_limiting.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            APP.Common.resetNav("nav-property-rate-limiting");
            APP.PropertyRateLimiting.init();
            $(".sortable-list").sortable().disableSelection();
        });
    </script>
</body>
</html>
